<template>
  <div class="hello">
    <ul>
    	<li v-for="i in mes">
    			<div>
    				{{i.media_name}}
    			</div>
    			<div>
    			<div v-for="item in i.image_list">
    					<img :src="item.url" alt="" />
    			</div>
    			</div>
    	</li>
    </ul>
  </div>
</template>


<script>
	
 export default{
    data(){
      return{
        mes:''
      }
    },
		created(){
      this.$http.jsonp('https://m.toutiao.com/list/?tag=__all__&ac=wap&count=20&format=json_raw&as=A1754937CF62685&cp=597FA2E6D8554E1&min_behot_time=0',{wd:'a'},{jsonp:''})
        .then(
            function(res) {
              this.mes=res.data.data;
				console.log(this.mes)
              },function(){
              console.log("失败了")
            }
          );
    }
  }
</script>


<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>


ul {
  list-style-type: none;
  padding: 0;
}


li {
  margin-top: 10px;

}
li>div:nth-of-type(2){
	width: 100%;
	display: flex;
}
li div img{
	  width: 100px;
 	  height: 100px;
 
}
a {
  color: #42b983;


}
</style>
